<!DOCTYPE html>
<meta charset="UTF-8">
<title>BiDi getCharNumAtPosition()</title>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<svg width="50px" height="60px" font-family="Arial" font-size="30px">
  <text y="40" direction="ltr">Foo   הפוך</text>
  <text text-anchor="end" y="70" direction="rtl">Foo   הפוך</text>
</svg>
<script>
function getExtents(textElement) {
    var glyphBBoxes = [];
    for (var i = 0; i < 8; ++i)
        glyphBBoxes.push(textElement.getExtentOfChar(i));
    return glyphBBoxes;
}

function getCharNums(textElement, glyphBBoxes) {
    var charNums = [];
    var point = textElement.ownerSVGElement.createSVGPoint();
    for (var i = 0; i < glyphBBoxes.length; ++i) {
        var bbox = glyphBBoxes[i];
        point.x = bbox.x + bbox.width / 2;
        point.y = bbox.y + bbox.height / 2;
        charNums.push(textElement.getCharNumAtPosition(point));
    }
    return charNums;
}

var textElements = document.querySelectorAll("text");
for (var j = 0; j < textElements.length; ++j) {
    var textElement = textElements[j];
    test(function() {
        assert_equals(textElement.textContent.length, 10);
        var glyphChars = getCharNums(textElement, getExtents(textElement));
        for (var i = 0; i < glyphChars.length; ++i)
            assert_equals(glyphChars[i], i);
    }, document.title+', direction='+textElement.getAttribute("direction")+'.');
}
</script>
